<div ng-show="advanced.showAdvancedSearch" class="advanced-search-view-container">
	<!-- Start advanced search -->
		<div class="advanced-search-form-container">
			<h1 class="advanced-search-title">Advanced <span>Search</span></h1>
			<form>
				<div class="form-section words-section">
			 		<h3 class="form-section-title">Words</h3>
					<span class="field-title">All of these words</span>
					<input class="field-value" ng-model="aSearch.union" type="text"><br>
					<span class="field-title">This exact phrase</span>
					<input class="field-value" ng-model="aSearch.phrase" type="text"><br>
					<span class="field-title">Any of these words</span>
					<input class="field-value" ng-model="aSearch.intersect" type="text"><br>
					<span class="field-title">None of these words</span>
					<input class="field-value" ng-model="aSearch.negUnion" type="text"><br>
					<span class="field-title">These hashtags</span>
					<input class="field-value" ng-model="aSearch.hashtags" type="text"><br>
					<span class="field-title profane-field-title">Remove profane results</span>
					<span ng-click="advanced.toggleProfanity();"  class="profanity-checkbox"><i ng-show="advanced.removeProfane" class="fa fa-check"></i></span>

					<!-- When possible, add written in language options -->
				</div>

				<div class="form-section people-section">
					<h3>People</h3>
					<span class="field-title">From these accounts</span>
					<input class="field-value" ng-model="aSearch.accountIntersect" type="text"><br>
					<span class="field-title">Mentioning those accounts</span>
					<input class="field-value" ng-model="aSearch.accountMentionUnion" type="text"><br>
				</div>

				<div class="form-section location-section">
					<h3>Place</h3>
					<span class="field-title">Near this place</span>
					<div>
						<input type="text" ng-model="chosenLocation" class="chosen-location" ng-click="advanced.toggleShowLookUp()">
						<ul class="suggestions" ng-show="advanced.hasSuggestions">
							<li ng-repeat="location in advanced.locationSuggestions | limitTo:5" ng-click="advanced.setLocation(location.query)">{{location.query}}</li>
						</ul>
					</div>
					<span class="location-hint">Click to change/choose location</span>
					<br>
				</div>

				<!-- Time period pickers-->
					<div class="form-section date-range-section">
						<h3>Dates</h3>
						<span class="field-title from-this-date">From this date</span>

						<div class="form-inline">
			                <div class="input-group dropdown">
				                <span class="input-group-addon">
				                  <span class="glyphicon glyphicon-calendar"></span>
				                </span>
				                <a class="dropdown-toggle my-toggle-select" id="datetimepicker1" role="button" data-toggle="dropdown" data-target="#" href="">
				                    <div class="input-append">
				                        <input type="text" class="form-control date-input" ng-model="aSearch.sinceDate">
				                    </div>
				                </a>
				                <ul class="dropdown-menu" role="menu" aria-labelledby="datetimepicker1">
				                    <datetimepicker ng-model="aSearch.sinceDate" data-datetimepicker-config="{ dropdownSelector: '.my-toggle-select', minView: 'hour' }"></datetimepicker>
				                </ul>
			            	</div>
			            </div>
			            <br>
			            <span class="field-title from-this-date">To this date</span>
			            <div class="form-inline">
				            <div class="input-group dropdown">
				                <span class="input-group-addon">
				              <span class="glyphicon glyphicon-calendar"></span>
				                </span>
				                <a class="dropdown-toggle my-toggle-select" id="datetimepicker2" role="button" data-toggle="dropdown" data-target="#" href="">
				                    <div class="input-append">
				                        <input type="text" class="form-control date-input" ng-model="aSearch.untilDate">
				                    </div>
				                </a>
				                <ul class="dropdown-menu" role="menu" aria-labelledby="datetimepicker2">
				                    <datetimepicker ng-model="aSearch.untilDate" data-datetimepicker-config="{ dropdownSelector: '.my-toggle-select', minView: 'hour' }"></datetimepicker>
				                </ul>
				            </div>

			            </div>
					</div>	
				<!-- End Time period pickers-->	
				<input class="submit-advanced-search" type="submit" ng-click="advanced.processSearch()" value="Submit" />
				<input class="reset-advanced-search" type="button" ng-click="advanced.reset()" value="Reset" />
			    
			</form>
		</div>
	<!-- ENd advanced search -->
</div>

<!-- Output result here -->
<div ng-show="advanced.isResultShow" class="search-container advanced-result-container">
	<div class="content-container">
		<h3 class="final-search-term">Search options : <span>{{advanced.finalParams.q}} </span><span ng-show="advanced.filterMessage">{{advanced.filterMessage}}</span></h3>
		<h3 class="result-message">
			<span ng-show="advanced.resultMessage">{{advanced.resultMessage}}</span>
			<div class="create-new-search"><span ng-click="advanced.initNewSearchView()">New search</span></div>
		</h3>
		<div class="result-container">
			<div class="filters-container">
			    <ul class="search-modes">
			        <!-- General filters -->
			        <li  ng-class="(advanced.currentFilter === 'live') ? 'active' : ''" ng-click="advanced.filterLive()">
			            <a href="#">live</a>
			        </li>
			        <li  ng-class="(advanced.currentFilter === 'accounts') ? 'active' : ''" ng-click="advanced.filterAccounts()">
			            <a href="#">accounts</a>
			        </li>
			        <li  ng-class="(advanced.currentFilter === 'photos') ? 'active' : ''" ng-click="advanced.filterPhotos()">
			            <a href="#">photos</a>
			        </li>
			        <li ng-class="(advanced.currentFilter === 'videos') ? 'active' : ''" ng-click="advanced.filterVideos()">
			            <a href="#">videos</a>
			        </li>
			        <li ng-class="(advanced.currentFilter === 'map') ? 'active' : ''" ng-click="advanced.filterMap()">
			            <a href="#">map</a>
			        </li>
			    </ul>
			</div>

			<div ng-show="!advanced.mapSearch" class="advanced-normal-result">
				<div ng-show="!advanced.peopleSearch" class="main-result-container">
				    <div ng-repeat="status in advanced.currentResult" status data="status"></div>   
				</div>	

				<div ng-show="advanced.peopleSearch" class="main-result-container">
				    <div ng-repeat="account in advanced.accounts" account data="account"></div>
				</div>
			</div>

			<!-- Map search -->
			
		</div>	
		<div ng-show="advanced.mapSearch" class="advanced-search-map-wrapper map-container-parent">
		    <div id="advanced-search-map"></div>
		</div>	
	</div>
</div>



		